﻿
 .downarrowdiv
 {
    display:none;
    position:absolute;
    top:0;
    left:0;
    width:auto;
    min-width:50px;
    min-height:20px; /*min height of DIV should be set to at least 2x the width of the arrow*/
    color:white;
    padding:10px;
    word-wrap:break-word;
    
    -moz-border-radius: 12px;
    -webkit-border-radius: 12px;
    border-radius: 12px; /* future proofing */
    -khtml-border-radius: 12px; /* for old Konqueror browsers */
    
    margin-bottom:2em;

    filter:alpha(opacity=90);opacity:0.9;

    background: #c81818;
    background: -webkit-gradient(linear, left top, left bottom, from(#ed5959), to(#c81818));
	background: -moz-linear-gradient(top,  #ed5959,  #c81818);
	filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#ed5959', endColorstr='#c81818');
    
}


.downarrowdiv:after{ /*arrow added to downarrowdiv DIV*/                     
content:'';
display:block;
position:absolute;
top:100%; /*should be set to 100% */
left:30px;
width:0;
height:0;
border-color: #c81818 transparent transparent transparent; /*border color should be same as div div background color*/
border-style: solid;
border-width: 10px;
}
